<template>
  <el-select
    v-model="classifyValue"
    :placeholder="dataList.Placeholder"
    :disabled="disabled"
    @change="change"
  >
    <el-option
      v-for="item in classifyList"
      :key="item.id"
      :label="item.name"
      :value="item.id"
    >
    </el-option>
  </el-select>
</template>

<script>
import {getList} from "@/ModuleSysBusiness/api/SysBusiness/SysBusinessCategory.js";
export default {
  name: "DeviceCategory",
  components: {},
  props: {
    disabled: {
      type: Boolean,
      default: false,
    },
    // 查询条件下是否需要全部
    isAll: {
      type: Boolean,
      default: false,
    },
    // 使用id或者使用code绑定
    value: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      classifyList: [],
      classifyValue: -1,
    };
  },
  computed: {
    dataList() {
      return this.$t("ModuleDevice.Device");
    },
  },
  watch: {
    value(val) {
      this.classifyValue = val;
    },
  },
  mounted() {
    this.classifyValue = this.value;
    this.initData();
  },
  methods: {
    change() {
      this.$emit("input", this.classifyValue);
    },
    initData() {
      getList({ AppId: 2000, Status: 1 }, { pageIndex: 1, pageSize: 10000 })
        .then((res) => {
          if (res.data.dataList !== null) {
            this.classifyList = res.data.dataList.map((x) => {
              x.name = this.$i18n.locale === "en" ? x.eName : x.name;
              return x;
            });
            if (this.isAll) {
              var obj = {};
              obj.id = "-1";
              obj.value = "-1";
              obj.name = this.$i18n.locale === "en" ? "All" : "全部";
              this.classifyList.unshift(obj);
            }
          }
        });
    },
  },
};
</script>
<style scoped></style>
